<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<style>
			.form-item{margin-bottom: 12px;}
		</style>
		<div class="super-theme-example">
			<div class="options-toolbar">	
				<form id="blacklistDatagridQueryParams">
					<input class="easyui-textbox" name="tel" data-options="width:120,prompt:'电话号码...'">
					<input class="easyui-textbox" name="comments" data-options="width:150,prompt:'备注...'">
					<a href="javascript:void(0)" class="easyui-linkbutton primary" data-options="iconCls:'fa fa-search'" onclick="app_blacklist.methods.queryDatagrid();">查询</a>
				</form>
				<div class="top-options">
					<a href="javascript:void(0)" class="easyui-linkbutton success" data-options="iconCls:'fa fa-plus'" onclick="app_blacklist.methods.createblacklist();">新建</a>
				</div>
			</div>
			<table id="blacklist-datagrid"></table>
			<div id="blacklistEditWin" class="easyui-window" title="模板" style="width:400px;height:360px" data-options="closed:true,modal:true,minimizable:false,maximizable:false,tools:[{iconCls:'fa fa-save',handler:function(){app_blacklist.methods.saveblacklist();}}]">
				<div class="super-theme-example" style="margin: 0px auto;">
					<form id="blacklistEditForm">
						<input name="id" type="hidden" />
						<div class="form-item">
							<label for="" class="label-top">电话号码：</label>
							<input name="tel" class="easyui-textbox" prompt="名称..." style="width: 100%;">
						</div>
						<!-- <div class="form-item">
							<label for="" class="label-top">地址：</label>
							<input name="addressDetails" class="easyui-textbox" data-options="multiline:true" style="width: 100%; height: 60px;" prompt="备注...">
						</div> -->
						<div class="form-item">
							<label for="" class="label-top">备注：</label>
							<input name="comments" class="easyui-textbox" data-options="multiline:true" style="width: 100%; height: 60px;">
						</div>
					</form>
				</div>
			</div>
		</div>
		<script type="text/javascript">
			var app_blacklist = {
				datas : {} , 
				methods : {
					initDatagrid : function(){
						var rowData = $('#blacklistDatagridQueryParams').serializeJson()
						$('#blacklist-datagrid').datagrid({
							height: $(document).height() - 200,
							url: commonConfig.shopUrlPrefix() + '/blackList/list',
						    columns:[[
								{field:'tel',title:'电话号码',width:100,align:'center'},
								// {field:'addressDetails',title:'地址',width:80,align:'center'},
								{field:'comments',title:'备注',width:120,align:'center'},
								{field:'updatedAt',title:'修改时间',width:120,align:'center',formatter: function(value,row,index){
									return FormatDate(value);
								}},
								// {field:'createdBy',title:'编辑者',width:120,align:'center'},
								{field:'options',title:'操作',width:150,align:'center',formatter: function(value,row,index){
									return	'<button class="row-btn info" onclick="app_blacklist.methods.editblacklist('+index+');">编辑</button>'+
											'<button class="row-btn primary" onclick="app_blacklist.methods.deleteblacklist('+row.id+');">删除</button>';
								}}
						    ]]
						});
					},
					openCreateblacklistWindow: function(){
						$('#blacklistEditWin').window('open');	
						$('#blacklistEditForm').form('clear');
					},
					deleteblacklist: function(blacklistId){
						$.messager.confirm('提示', '确定删除?', function(r){
							if (r){
								requestServer(commonConfig.shopUrlPrefix() + '/blackList/' + blacklistId, 'DELETE').then((response) => {
									if (response.code == 1) {
										showMessage('<i class="fa fa-info-circle"></i>&nbsp; 删除成功...');
										app_blacklist.methods.queryDatagrid();
									}else {
										$.messager.alert('提示',response.message,'error');
									}
								}).catch((error) => {
									console.log(error)
								});
							}
						});
					},
					createblacklist: function(){
						app_blacklist.methods.openCreateblacklistWindow();
					},
					editblacklist: function(index){
						// 在这里初始化数据
						app_blacklist.methods.openCreateblacklistWindow();
						var rowData = $('#blacklist-datagrid').datagrid('getRows')[index] ; 
						$('#blacklistEditForm').form('load' , rowData);
					},
					saveblacklist: function(){
						var rowData = $('#blacklistEditForm').serializeJson()
						rowData.lockTime = 0
						requestBodyServer(commonConfig.shopUrlPrefix() + '/blackList', 'POST', rowData).then((response) => {
							if (response.code == 1) {
								showMessage('<i class="fa fa-info-circle"></i>&nbsp; 成功...');
								$('#blacklistEditWin').window('close');
								app_blacklist.methods.queryDatagrid();
							}else {
								$.messager.alert('提示',response.message,'error');
							}
						}).catch((error) => {
							console.log(error)
						});
					},
					initDatagridQueryParams: function(){
						var params = $('#blacklistDatagridQueryParams').serializeArray();
						var queryParams = {};
						$.each(params , function(index , param){
						     queryParams[param.name] = param.value;
						})
						return queryParams;
					},
					queryDatagrid: function(){
						$('#blacklist-datagrid').datagrid('load',app_blacklist.methods.initDatagridQueryParams());
					},
				},
				init : function(){
					app_blacklist.methods.initDatagrid();
				}
			}
			app_blacklist.init();
		</script>
	</body>
</html>
